﻿@page "/components/tooltip"

<DocsPage>
    <DocsPageHeader Title="Tooltip"/>
    <DocsPageContent>
        <DocsPageSection>
            <SectionHeader Title="Simple Tooltips">
                <Description></Description>
            </SectionHeader>
            <SectionContent Outlined="true" Class="py-8">
                <TooltipSimpleExample />
            </SectionContent>
            <SectionSource Code="TooltipSimpleExample" GitHubFolderName="Tooltip"  />
        </DocsPageSection>
        <DocsPageSection>
            <SectionHeader Title="Change Default Delay">
                <Description>The tooltip's default delay can be set with <CodeInline>Delay</CodeInline> as a double in milliseconds.</Description>
            </SectionHeader>
            <SectionContent Outlined="true" Class="py-8">
                <TooltipDelayedExample />
            </SectionContent>
            <SectionSource Code="TooltipDelayedExample" ShowCode="false" GitHubFolderName="Tooltip"  />
        </DocsPageSection>
        <DocsPageSection>
            <SectionHeader Title="Postioned Tooltips">
                <Description>With the <CodeInline>Placement</CodeInline> enum,  you can change the default position of the tooltip.</Description>
            </SectionHeader>
            <SectionContent Outlined="true" Class="py-8">
                <TooltipPostionExample />
            </SectionContent>
            <SectionSource Code="TooltipPostionExample" GitHubFolderName="Tooltip"  />
        </DocsPageSection>
        <DocsPageSection>
            <SectionHeader Title="HTML Tooltips">
                <Description>With the <CodeInline>TooltipContent</CodeInline> render fragment, you can specify custom HTML content for your tooltip.</Description>
            </SectionHeader>
            <SectionContent Outlined="true" Class="py-8">
                <TooltipHtmlExample />
            </SectionContent>
            <SectionSource Code="TooltipHtmlExample" GitHubFolderName="Tooltip"  />
        </DocsPageSection>
    </DocsPageContent>
</DocsPage>
